<template>
  <swiper-container
    class="swiper-container"
    ref="mainSwiper"
    :autoplay="swiperOptions.autoplay"
    @init="init"
    :loop="true"
  >
    <swiper-slide v-pre>
      <div class="trust">
        <img src="../assets/images/images/six_img_02.png" alt="" />
        <div class="trustright">
          <img src="../assets/page/yinhao.png" alt="" />
          <p>
            通全物同，热点地发可扩展的核心意争力，通过可扩展的流天健开发鸿授现的一数。专业地利用他人的丈体和点击潜力和高回根的可村成黑。完全不道重负的241365
            次导孩能，而不是换立的减混，在服现投发
            利基市场之前，独特地丈现浙进式外包。
          </p>
        </div>
      </div>
    </swiper-slide>
    <swiper-slide v-pre>
      <div class="trust">
        <img src="../assets/images/images/six_img_02.png" alt="" />
        <div class="trustright">
          <img src="../assets/page/yinhao.png" alt="" />
          <p>
            通全物同，热点地发可扩展的核心意争力，通过可扩展的流天健开发鸿授现的一数。专业地利用他人的丈体和点击潜力和高回根的可村成黑。完全不道重负的241365
            次导孩能，而不是换立的减混，在服现投发
            利基市场之前，独特地丈现浙进式外包。
          </p>
        </div>
      </div>
    </swiper-slide>
    <swiper-slide v-pre>
      <div class="trust">
        <img src="../assets/images/images/six_img_02.png" alt="" />
        <div class="trustright">
          <img src="../assets/page/yinhao.png" alt="" />
          <p>
            通全物同，热点地发可扩展的核心意争力，通过可扩展的流天健开发鸿授现的一数。专业地利用他人的丈体和点击潜力和高回根的可村成黑。完全不道重负的241365
            次导孩能，而不是换立的减混，在服现投发
            利基市场之前，独特地丈现浙进式外包。
          </p>
        </div>
      </div>
    </swiper-slide>
  </swiper-container>
</template>

<script setup>
import { register } from "swiper/element/bundle";
register(); // 注册 swiper 组件,如果安装方法使用的是 cdn,则不需要这一步,也不需要上方的引入
const swiperOptions = {
  autoplay: {
    delay: 1000,
    enabled: true,
  },
};
const init = () => {
  console.log("1");
};
</script>


<style lang="scss">
.trust {
  width: 100%;
  display: flex;

  .trustright {
    padding: 0 30px;
    background-color: #f4f6f7;
  }
}
@media screen and (max-width: 1024px) {
  .trust {
    display: block;
    .trustright {
      width: 100%;
    }
  }
  .trust > img {
    width: 100%;
  }
}
@media screen and (max-width: 370px) {
  .trust {
    display: block;
    .trustright {
      width: 100%;
    }
  }
  .trust > img {
    width: 100%;
  }
}
</style>